<template>
	<view>
		<view class="topVue">
			<view class="status"></view>
			<view class="top flex-between align-center padding-row30">
				<view class="back" @click="$tools.back()">
					<image src="../static/back.png" style="width: 20rpx; height: 34rpx;"></image>
				</view>
				<view class="title">{{title}}</view>
				<view class="right" @click="handleClick()">
					<u-icon :name="name" color="#1CC289" size="42" v-if="name"></u-icon>
				</view>
			</view>
		</view>
		<view class="place"></view>
	</view>
	
</template>

<script>
	export default {
		props: ["title", "name"],
		data(){
			return {
				
			}
		},
		methods: {
			handleClick(){
				this.$emit("handle")
			}
		}
	}
</script>

<style lang="less" scoped>
	.place {
		width: 100%;
		height: calc(92rpx + var(--status-bar-height));
	}
	.topVue {
		width: 100%;
		position: fixed;
		left: 0;
		top: 0;
		background: #fff;
		z-index: 99;
		.top {
			width: 100%;
			.back {
				width: 100rpx;
				height: 92rpx;
				line-height: 92rpx;
			}
			.title {
				width: 520rpx;
				height: 92rpx;
				line-height: 92rpx;
				text-align: center;
				color: #000;
				font-size: 34rpx;
				font-weight: 600;
			}
			.right {
				width: 100rpx;
				height: 92rpx;
				line-height: 92rpx;
				text-align: right;
			}
		}
	}
	
</style>